<template>
  <div>
    <a-modal
      title="本合同包含的全部业务"
      v-model="visible"
      :width="1000"
      @cancel="onCancel"
    >
      <a-tabs type="card" @change="onTabs">
        <a-tab-pane key="10" tab="商标"></a-tab-pane>
        <a-tab-pane key="20" tab="专利"></a-tab-pane>
        <a-tab-pane key="30" tab="版权"></a-tab-pane>
      </a-tabs>
      <s-table
        bordered
        ref="table"
        size="middle"
        :row-key="(record) => record.cb_id"
        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        :columns="allColumns"
        :data="allData"
      >
        <template slot="sb_reg_no" slot-scope="text, record">
          {{text}}{{record.zl_no}}
        </template>
        <template slot="sb_name" slot-scope="text, record">
          <div v-if="category == '10'"><a-input style="width: 150px" type="text" v-model="nameForm[record.cb_id]" placeholder="要修改的名称"></a-input> <a-button size="small" type="link" icon="edit" @click="editName(record.cb_id, record.sb_name)"></a-button></div>
          <div v-if="category == '20'"><a-input style="width: 150px" type="text" v-model="nameForm[record.cb_id]" placeholder="要修改的名称"></a-input> <a-button size="small" type="link" icon="edit" @click="editName(record.cb_id, record.zl_name)"></a-button></div>
        </template>
        <template slot="status2" slot-scope="text, record">
          <div v-if="record.state_file_url !== ''">
            <div>
              <a :href="record.state_file_url" target="_blank"><a-icon :style="{ fontSize: '18px', color: '#1890ff' }" type="file-pdf" /></a>
              <a @click="downFile(record.state_file_url, record.state_file_name)"><a-icon :style="{ fontSize: '18px', color: '#1890ff' }" type="download" /></a>
              {{ record.state_name }}
            </div>
<!--            <div>{{ record.state_file_name }}</div>-->
          </div>
          <div v-else>
            <a-button v-if="text == 24" type="danger" icon="edit" size="small" @click="getResult(record.cb_id)">{{ record.status2_name }}</a-button>
            <a-button v-if="text == 10 || text == 22" type="danger" icon="edit" size="small" @click="getSubmitFill(record.cb_id)">{{ record.status2_name }}</a-button>
            <a-button v-if="text == 34" type="danger" icon="edit" size="small" @click="getConfirm(record.cb_id)">{{ record.status2_name }}</a-button>
            <a-button
              ghost
              v-if="text == 20 || text == 26 || text == 35 || text == 36"
              type="danger"
              size="small"
              @click="getSubmitFill(record.cb_id)"
            >
              {{ record.status2_name }}
            </a-button>
            <a-button
              ghost
              v-if="text == 30"
              type="primary"
              size="small"
              @click="getSubmitFill(record.cb_id)"
            >
              {{ record.status2_name }}
            </a-button>
            <a-button v-if="text == 40" type="primary" size="small" @click="getSubmitFill(record.cb_id)">{{ record.status2_name }}</a-button>
            <a-button v-if="text == 50" type="dashed" size="small" @click="getSubmitFill(record.cb_id)">{{ record.status2_name }}</a-button>
          </div>
        </template>
        <template slot="action">
          <a-button size="small" type="primary" @click="reset">重置</a-button>
        </template>
      </s-table>
      <div style="margin-bottom: 30px">
        <a-button :disabled="selectedRowKeys.length == 0" style="margin-right:5px" size="small" type="danger">批量上传</a-button>
        <a-button :disabled="selectedRowKeys.length == 0" size="small" type="primary">批量下载</a-button>
      </div>
    </a-modal>
    <fill-modal v-if="visible2" :fill-key="fillKey" :from-source="'1'" @submit="handleSubmit" @cancel="handleCancel"></fill-modal>
    <patent-modal v-if="visible3" :fill-key="fillKey" @submit="submitPatent" @cancel="patentExit"></patent-modal>
    <confirm-modal v-if="visible4" :fill-key="fillKey" @submit="handleSubmit1" @cancel="handleCancel1"></confirm-modal>
  </div>
</template>

<script>
  import { STable } from '@/components'
  import businessColumns from '@/columns/business'
  import { getList, postEditName, postFill } from '@/api/business'
  import FillModal from '@/views/business/components/FillModal'
  import PatentModal from '@/views/business/components/PatentModal'
  import ConfirmModal from '@/views/business/components/ConfirmModal'
  import apis from '@/api'

  export default {
    props: {
      subject: {
        type: String,
        default: ''
      },
      category: {
        type: String,
        default: ''
      }
    },
    components: {
      STable, FillModal, PatentModal, ConfirmModal
    },
    name: 'ByAll',
    data () {
      return {
        visible: true,
        visible2: false,
        visible3: false,
        visible4: false,
        fillKey: '',
        allColumns: businessColumns.tmModal1,
        allData: parameters => {
          return getList(Object.assign(parameters, this.queryParam)).then(res => {
            for (let i = 0; i < res.result.data.length; i++) {
              if (this.category === '10') {
                this.nameForm[res.result.data[i].cb_id] = res.result.data[i].sb_name
              } else if (this.category === '20') {
                this.nameForm[res.result.data[i].cb_id] = res.result.data[i].zl_name
              }
            }
            return res.result
          })
        },
        queryParam: {},
        selectedRowKeys: [],
        nameForm: {}
      }
    },
    created () {
      this.queryParam['filter[category]'] = '10'
      if (this.category === '10') {
        this.queryParam['filter[subject]'] = this.subject
      } else if (this.category === '20') {
        this.queryParam['filter[customer_name]'] = this.subject
      }
    },
    methods: {
      onCancel () {
        this.visible = false
        this.$emit('cancel', this.visible)
      },
      onSelectChange (selectedRowKeys) {
        this.selectedRowKeys = selectedRowKeys
      },
      onTabs (key) {
        this.queryParam['filter[category]'] = key
        this.$refs.table.refresh()
      },
      downFile (value, filename) {
        window.open(apis.Download + '?value=' + value + '&filename=' + filename)
      },
      getSubmitFill (id) {
        this.fillKey = id
        this.visible2 = true
      },
      getConfirm (id) {
        this.fillKey = id
        this.visible3 = true
      },
      handleSubmit (form) {
        const app = this
        form['cb_id'] = app.fillKey
        postFill(form).then(res => {
          if (res.status === 0) {
            app.$refs.table.refresh()
            app.handleCancel()
          } else {
            app.$warning({
              title: res.msg
            })
          }
        })
      },
      handleCancel (visible) {
        this.visible2 = visible
      },
      submitPatent (form) {
        const app = this
        form['cb_id'] = app.fillKey
        postFill(form).then(res => {
          if (res.status === 0) {
            app.$refs.table.refresh()
            app.patentExit()
          } else {
            app.$warning({
              title: res.msg
            })
            return false
          }
        })
      },
      patentExit () {
        this.visible3 = false
      },
      getResult (id) {
        this.fillKey = id
        this.visible4 = true
      },
      handleSubmit1 (form) {
        const app = this
        form['cb_id'] = app.fillKey
        postFill(form).then(res => {
          if (res.status === 0) {
            app.$refs.table.refresh()
            app.handleCancel1()
          } else {
            app.$warning({
              title: res.msg
            })
          }
        })
      },
      handleCancel1 () {
        this.visible4 = false
      },
      editName (id, name) {
        const app = this
        const { nameForm } = this
        const data = {}
        data['contractBusiness[category]'] = app.category
        if (nameForm[id] !== name) {
          data['contractBusiness[name]'] = nameForm[id]
          postEditName(id, data).then(res => {
            if (res.status === 0) {
              app.$refs.table.refresh()
            } else {
              app.$warning({
                title: res.msg
              })
            }
          })
        }
      },
      reset () {
        this.$refs.table.refresh()
      }
    }
  }
</script>

<style scoped>

</style>
